<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/10/17
  Time: 15:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>按照代理人统计</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css" media="all">
    <script src="${pageContext.request.contextPath}/static/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/echarts.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/macarons.js"></script>
</head>
<body>
<div id="main" style="width: 800px;height:500px;"></div>
</body>
<script type="text/javascript">
    layui.use(['jquery'], function () {
            var $$$=layui.jquery;
        $$$.ajax({
            url: "${pageContext.request.contextPath}/count?method=byEmp",
            type: "POST",
            dataType: "JSON",
            success: function (data) {
                if (data.code == 0) {
                    //获取横坐标
                    var empNames=data.data.empNames;
                    //获取y坐标1
                    var nums=data.data.nums;
                    //获取y坐标2
                    var moneys=data.data.moneys;
                    // 基于准备好的dom，初始化echarts实例
                    var myChart = echarts.init(document.getElementById('main'),'macarons');

                    // 指定图表的配置项和数据
                    var option = {
                        title: {
                            text: '代理人业务数量个金额统计',
                            subtext: '商标业务'
                        },
                        tooltip: {
                            trigger: 'axis'
                        },
                        legend: {
                            data: ['业务数量', '总金额[万元]']
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: {show: true, readOnly: false},
                                magicType: {show: true, type: ['line', 'bar']},
                                restore: {show: true},
                                saveAsImage: {show: true}
                            }
                        },
                        calculable: true,
                        xAxis: [
                            {
                                type: 'category',
                                data: empNames
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value'
                            }
                        ],
                        series: [
                            {
                                name: '业务数量',
                                type: 'bar',
                                data: nums,
                                markPoint: {
                                    data: [
                                        {type: 'max', name: '最大值'},
                                        {type: 'min', name: '最小值'}
                                    ]
                                },
                                markLine: {
                                    data: [
                                        {type: 'average', name: '平均值'}
                                    ]
                                }
                            },
                            {
                                name: '总金额[万元]',
                                type: 'bar',
                                data: moneys,
                                /*markPoint: {
                                    data: [
                                        {name: '年最高', value: 182.2, xAxis: 7, yAxis: 183},
                                        {name: '年最低', value: 2.3, xAxis: 11, yAxis: 3}
                                    ]
                                },
                                markLine: {
                                    data: [
                                        {type: 'average', name: '平均值'}
                                    ]
                                }*/
                            }
                        ]
                    };


                    // 使用刚指定的配置项和数据显示图表。
                    myChart.setOption(option);
                }
            }

        });
    });


</script>
</html>
